<script setup lang="ts">
defineProps<{
  title?: string;
  description?: string;
}>();
</script>

<template>
  <div class="login-header">
    <h1 class="login-title">{{ title }}</h1>
    <p class="login-desc">{{ description }}</p>
  </div>
</template>

<style scoped lang="scss">
@use "../styles/variables.scss" as vars;

.login-header {
  text-align: center;
  margin-bottom: 30px;
  .login-title {
    font-size: 24px;
    font-weight: 600;
    color: vars.$text-color;
    margin: 0 0 10px 0;
  }
  .login-desc {
    font-size: 14px;
    color: vars.$secondary-color;
    margin: 0;
  }
}
</style>
